<template>
  <div id="management">
    <div class="head">        
         <div class="back" @click="$router.go(-1)">            
           <mu-icon value="chevron_left"  />
        </div>
        <div class="search" @click="">
            梵舍管家            
        </div>
        <div class="flex1"></div>
    </div>
    
    <p class="p_center">房间名称</p>

    <ul class="fs_jggblog ">
       <li>门锁</li> 
       <li>空调</li> 
       <li>冰箱</li> 
       <li>电表</li> 
       <li>煤气</li> 
    </ul>
    <hostfooter></hostfooter>
  </div>
</template>

<script>
    //require('../../assets/css/personalcenter.scss'); //引入的scss
    import hostfooter from '../../common/hostfooter'
    import {
        mapState,
        mapGetters,
        mapMutations,
        mapActions
    } from 'vuex'
    export default {
        name: 'management', //组件的名字
        data() {
            return { //数据
                msg: '设备管理'
            }
        },
        methods: { //方法
            
        },
        computed: { //计算 用来引入vuex里面state

        },
        mounted: function() { //组件加载完成

        },
        watch: { //健康某个数据变化后触发某个事件

        },
        destroyed: function() { //离开这个组件
        },
        components: {
            'hostfooter':hostfooter
        }

    }
</script>
<style scoped lang="scss">
    .head {
        .back {
            flex: 1;
            text-align: center;
            color: #fff;
            line-height: 64px;
        }
        .search {
            flex: 5;
            position: relative;
            text-align: center;
            color: #fff;
            font-size: 18px;
        }
        .email {
            flex: 1;
            line-height: 64px;
            text-align: center;
            color: #fff;
        }
    }
    .fs_jggblog{
        width: 80%;
        margin:0 auto;
        li{
            height: 80px;
            text-align: center;
            line-height: 80px;
            border: 3px solid #999;
            margin: 0 1%;
            margin-bottom: 10px;
            color: #333;
            width: 30.3%;
            float: left;
        }
    }
    .p_center{
        text-align:center;
        margin:20px 0;
        color:#333;
    }
</style>
<!-- Add "scoped" attribute to limit CSS to this component only -->